<script setup>
import { PlusOutlined, SearchOutlined, RedoOutlined } from '@ant-design/icons-vue';
// import { getOptions } from '@/utils'
import { ref } from 'vue';

const emits = defineEmits(['add', 'init', 'search'])
// 新增按钮点击
const add = () => {
  emits('add')
}
// 刷新
const productName = ref('')
const storageName = ref('')
const accepterName = ref('')
const outTypeId = ref(null)
// const outBigTypeId = ref(null)
// const outSmallTypeId = ref(null)
const init = () => {
  productName.value = ''
  storageName.value = ''
  accepterName.value = ''
  outTypeId.value = null
  // outBigTypeId.value = null
  // outSmallTypeId.value = null
  emits('init')
}
// 搜索
const search = () => {
  emits('search', {
    productName: productName.value,
    storageName: storageName.value,
    accepterName: accepterName.value,
    outTypeId: outTypeId.value,
    // outBigTypeId: outBigTypeId.value,
    // outSmallTypeId: outSmallTypeId.value,
  })
}
</script>

<template>
  <div class="head">
    <AButton type="primary" @click="add">
      <PlusOutlined /> 新增
    </AButton>
    <div class="right">
      <a-input @input="search" v-model:value="productName" placeholder="请输入物资名称查询" class="com-ipt" allowClear>
        <template #suffix>
          <SearchOutlined />
        </template>
      </a-input>
      <a-input @input="search" v-model:value="storageName" placeholder="请输入出库人员查询" class="com-ipt" allowClear>
        <template #suffix>
          <SearchOutlined />
        </template>
      </a-input>
      <a-input @input="search" v-model:value="accepterName" placeholder="请输入领用人员查询" class="com-ipt" allowClear>
        <template #suffix>
          <SearchOutlined />
        </template>
      </a-input>
      <!-- <a-select @change="search" class="com-ipt" placeholder="筛选出库类型" v-model:value="outTypeId"
        :options="getOptions('inventory_type')" allowClear :fieldNames="{ label: 'constLabel', value: 'constValue' }" /> -->
      <!-- <a-select @change="search" class="com-ipt" placeholder="筛选物资大类型" v-model:value="outBigTypeId"
        :options="getOptions('inventory_big_type')" allowClear
        :fieldNames="{ label: 'constLabel', value: 'constValue' }" />
      <a-select @change="search" class="com-ipt" placeholder="筛选物资小类型" v-model:value="outSmallTypeId"
        :options="getOptions('inventory_small_type')" allowClear
        :fieldNames="{ label: 'constLabel', value: 'constValue' }" /> -->
      <AButton type="primary" @click="search">
        <SearchOutlined /> 搜索
      </AButton>
      <AButton type="primary" @click="init">
        <RedoOutlined /> 刷新
      </AButton>
    </div>
  </div>
</template>

<style lang="scss" scoped>
.head {
  display: flex;
  gap: 8px;
  justify-content: space-between;

  .right {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
}
</style>